<template>
	<view class="my_information">
		<view class="information_item" v-for="item in noticeList" :key="item.id" @click="goToinfoDetails(item)"
		 @touchstart.prevent="touchstart(item.id)" @touchend.prevent="touchend">
			<image class="item_one" src="https://community.chuangxiangdianli.com/images/neighborimg/user.png" mode=""></image>
			<view class="item_con">
				<text class="it_con_tit">了橡树俺儿</text>
				<view class="it_con_info">
					<text>长按可删除通知消息，点击跳转 到说说详情页到说说详情页到说说详情页到说说详情页 </text>
				</view>
				<view class="it_con_foo">
					<text>{{item.msg}}</text>
					<text>2019.05.16 </text>
				</view>
			</view>
			<image class="item_tow" src="https://community.chuangxiangdianli.com/images/neighborimg/z_tr@2x.png" mode=""></image>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				noticeList: []
			};
		},
		onShow() {
			this.getNoticeList()
		},
		methods: {
			goToinfoDetails(item) {
				uni.navigateTo({
					url: '/neighbor/infodetails/index?id=' + item.id + '&from=information'
				})
			},
			// 获取消息列表
			getNoticeList() {
				let _this = this
				_this.$http.get('Mini/circle/getNotice').then(({
					code,
					data,
					msg
				}) => {
					if (code == 200) {
						_this.noticeList = data
					} else {
						uni.showToast({
							title: msg,
							icon: 'none'
						})
					}
				})
			},
			touchstart(id) {
				let that = this;
				clearInterval(this.Loop); //再次清空定时器，防止重复注册定时器
				this.Loop = setTimeout(function() {
					uni.showModal({
						title: '删除消息',
						content: '确定要删除本条消息吗？',
						success: async function(res) {
							if (res.confirm) {
								// 删除评论 
								that.$mrequest2({
									url: 'Mini/circle/circleComment/' + id,
									method: 'DELETE'
								}).then(res => {
									if (res.code == 200) {
										console.log(res)
										uni.showToast({
											title: '删除成功',
											icon: 'none'
										})
										that.getNoticeList()
									}
								})
							} else if (res.cancel) {
								console.log('用户点击取消')
							}
						}
					});

				}.bind(this), 1000);

			},
			touchend() {
				clearInterval(this.Loop);
			},

		}
	}
</script>

<style lang="scss">
	.my_information {
		padding: 10rpx 22rpx;

		.information_item {
			display: flex;
			padding: 25rpx 0;
			height: 210rpx;
			border-bottom: 1rpx solid #eee;

			.item_one {
				width: 100rpx;
				height: 100rpx;
			}

			.item_con {
				margin: 0 30rpx 0 20rpx;
				width: 400rpx;

				.it_con_tit {
					font-size: 30rpx;
					color: #34c39e;
					font-weight: 700;
				}

				.it_con_info {
					height: 80rpx;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 2;
					overflow: hidden;
				}

				.it_con_foo {
					display: flex;
					justify-content: space-between;
					color: #999;
				}
			}

			.item_tow {
				width: 150rpx;
				height: 150rpx;
			}
		}
	}
</style>
